<import file="block/common.html" name="url" :tpl_cfg="['urlName'=>'访问记录']" />
<div class="layui-fluid">
  <div class="layui-row layui-col-space15">
    <div class="layui-col-md12">
      <div id="showline" style="height:800px;width: 100%;"></div>
    </div>
  </div>
</div>
<script src="<?php echo U_RES;?>/lib/chart/echarts.min.js"></script>
<script>
  $.getJSON("<{CAUrl('visit','index')}>&list_json", function (res) {
    var showline = echarts.init(document.getElementById('showline'));

    var date = [],
      visits = [];
    $.each(res.data, function (i, arr) {
      date.push(arr["date"]);
      visits.push(arr["visits"]);
    });


    showline.setOption({
      title: {
        text: '近30天访问量',
        subtext: '记录方式：page view',
        left: 'center'
      },
      tooltip: {
        trigger: 'axis'
      },
      legend: {
        //data: ['Email', 'Union Ads', 'Video Ads', 'Direct', 'Search Engine']
      },
      grid: {
        left: '0%',
        right: '0%',
        bottom: '3%',
        containLabel: true
      },
      xAxis: {
        type: 'category',
        data: date
      },
      yAxis: {
        type: 'value'
      },
      series: [
        {
          data: visits,
          type: 'line',
          stack: 'Total',
          smooth: true,
          lineStyle: {
            width: 0
          },
          showSymbol: true,
          areaStyle: {
            opacity: 0.8,
            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
              {
                offset: 0,
                color: 'rgb(128, 255, 165)'
              },
              {
                offset: 1,
                color: 'rgb(1, 191, 236)'
              }
            ])
          },
          emphasis: {
            focus: 'series'
          }, 
        },
      ]
    });

  });
</script>